$(function () {

  initProjectType() // 初始化项目类型下拉框
  initFrameWorkType()// 初始化技术框架类型下拉框
  getProjects() // 获取项目描述

  $('#btnquery').click(function(){
    getProjects();
  })
})

function initProjectType() {
  $.ajax({
      url: '/project/getprojecttype',    
      success: function (res) {   
          // 调用模板引擎
          if(res.data.code ==500){
            alert(res.data.msg);return;
          }
        let html = `<option value="-1">--请选择项目类型--</option>`;
         res.data.forEach(item => {
           html+=`<option value="${item.id}">${item.typeName}</option>`
         });
         $("#projectType").html(html);
      }
  })
}


function initFrameWorkType() {
  $.ajax({
      url: '/project/getframework',    
      success: function (res) {   
          // 调用模板引擎
          if(res.data.code ==500){
            alert(res.data.msg);return;
          }
         let html = `<option value="-1">--请选择技术框架--</option>`;
         res.data.forEach(item => {
           html+=`<option value="${item.id}">${item.tname}</option>`
         });
         $("#Framework").html(html);
      }
  })
}



function getProjects() {

  let ptype = $('#projectType').val();
  let ftype = $('#Framework').val();

  $.ajax({
      url: '/project/getproject',
      data:{
        ptype:ptype,
        ftype:ftype
      },
      success:  (res) =>{
          // 调用模板引擎
          if(res.data.code ==500){
            alert(res.data.msg);return;
          }
         let html = ``;
        //  console.log(res.data);
         res.data.forEach(item => {
           html += ` 
           <div  data-sjsel="flatty" class="col-sm-6 col-md-4 col-lg-4 ">
           <div class="thumbnail" style="height: auto;">
             <div class="caption">
               <h4>
                 项目名称：${item.pname}   周期：${item.pTimeOut}
               </h4>
              
               <p>
                 ${item.pContent}
               </p>
             </div>
           </div>
         </div> 
         `
         });
     
        document.querySelector('#row').innerHTML = html;
        // document.querySelector('#row').sortablejs();
     
        // document.querySelector('#row').style="height:10000px";
      }
  })
}
